<html>
<head>
    <meta content="text/html" />
    <title>图片预览</title>
    <script language=javascript>
        function previewFile() {
            var preview = document.querySelector('img');
            var file  = document.querySelector('input[type=file]').files[0];
                console.log(file);
            var reader = new FileReader();
                console.log(reader);
            reader.onloadend = function () {
                console.log(reader.result);
                preview.src = reader.result;
            }
            if (file) {
                reader.readAsDataURL(file);
            } else {
                preview.src = "";
            }
        }
    </script>
</head>
<body>
    <input type="file" onchange="previewFile()"><br>
    <img src="" height="400" width="600" alt="未选择图片"/>
</body>
</html>